<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- Favicon icon -->
    <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon.png">
    <title></title>
    <!-- Bootstrap Core CSS -->
    <link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom CSS -->
    <link href="css/style.css" rel="stylesheet">
    <!-- You can change the theme colors from here -->
    <link href="css/colors/blue.css" id="theme" rel="stylesheet">
  <script src="js/jquery.js"></script>
<script type="application/javascript">
    
    function quit(){
        var r = confirm('确定注销?');
        if(r == true){
            window.location.href='http://127.0.0.1:8848/t/moban453/index.html';
        }
    }
   function del(book_id){
       	var r = confirm("亲，您确定删除这本书吗？");
        if(r==true){
           $.ajax({
               type:'post',
               url:"http://127.0.0.1:8080/deleteById?book_id="+book_id,
               success:function(){   
                 alert("删除成功");
                 location.reload();
                   }  
           }) 
            
        }
     
       
       
   }
   
   
   
  $(function(){
      var index=0;
       var json = {"index":index};
      function rush(){
          alert("删除成功");
           window.location.href='table-basic.html';
      };
      $("#find").click(function (){ 
          var name1=$("#num").val();
        var regExp = new RegExp(name1, 'g');//创建正则表达式，g表示全局的，
        var json = {"book_name":name1};
        $.ajax({
            type:'post',
            url:"http://127.0.0.1:8080/findByName",
           contentType: "application/x-www-form-urlencoded", //传过去的数据类型，此为表单
           data:json,
           dataType:'json',
            success:function(data){   
               $("#table1").empty();
               for(var i=0;i<data.length;i++){
                  var newName =  data[i].book_name.replace(regExp,'<label style="color:red;font-weight:bold">'+name1+'</label>');
                    $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+newName+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=修改图书信息.html?name="+data[i].id+">编辑</a><a href=sure.html?name="+data[i].id+">删除</a></td></tr>");
                    
                }
                }  
        })
        
        
          });      
     $.ajax({
         type:'post',
         url:"http://127.0.0.1:8080/book_information",
        contentType: "application/x-www-form-urlencoded", //传过去的数据类型，此为表单
        data:json,
        dataType:'json',
         success:function(data){    
   
            for(var i=0;i<data.length;i++){
                 // $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+newName+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=# id=borrow? onclick=borrow("+data[i].id+","+account+")>借书</a></td></tr>");
                     $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=修改图书信息.html?name="+data[i].id+">编辑</a><a href=sure.html?name="+data[i].id+">删除</a></td></tr>")
                 // $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=# id=borrow onclick=borr("+data[i].id+","+account+")>借书</a></td></tr>")
             }
             }  
     })
     $("#last").click(function(){
         if(index == 0){
             index = 0;
         }
         else{
             index --;
         
            var json = {"index":index};
         $.ajax({
             type:'post',
             url:"http://127.0.0.1:8080/book_information",
            contentType: "application/x-www-form-urlencoded", //传过去的数据类型，此为表单
            data:json,
            dataType:'json',
             success:function(data){     
                  $("#table1").empty();
                for(var i=0;i<data.length;i++){
                        $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=修改图书信息.html?name="+data[i].id+">编辑</a><a href=sure.html?name="+data[i].id+">删除</a></td></tr>")
                     // $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=借书.html?name="+data[i].id+'&account='+account+">借书</a></td></tr>")
                 }
                 }  
         })
         }
     })
     
     $("#next").click(function(){
         if(index == 23){
             index = 23;
         }
         else{
             index ++;
         
            var json = {"index":index};
         $.ajax({
             type:'post',
             url:"http://127.0.0.1:8080/book_information",
            contentType: "application/x-www-form-urlencoded", //传过去的数据类型，此为表单
            data:json,
            dataType:'json',
             success:function(data){   
                $("#table1").empty();
                for(var i=0;i<data.length;i++){
    $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=修改图书信息.html?name="+data[i].id+">编辑</a><a href=sure.html?name="+data[i].id+">删除</a></td></tr>")
                 }
                 }  
         })
         }
     })
     $("#jump").click(function(){
        var page = $("#page").val()-1;
           
        if(page<0 || page>23){
            alert("没有该页数");
        }
        else{
               var json = {"index":page};
            $.ajax({
                type:'post',
                url:"http://127.0.0.1:8080/book_information",
               contentType: "application/x-www-form-urlencoded", //传过去的数据类型，此为表单
               data:json,
               dataType:'json',
                success:function(data){   
                   $("#table1").empty();
                   for(var i=0;i<data.length;i++){
    $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+data[i].book_name+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=修改图书信息.html?name="+data[i].id+">编辑</a><a href=# onclick=del("+data[i].id+")>删除</a></td></tr>")
                     // $("#table1").append("<tr><td>"+data[i].id+"</td><td>"+newName+"</td><td>"+data[i].book_author+"</td><td>"+data[i].book_classes+"</td><td>"+data[i].book_price+"</td><td>"+data[i].book_public+"</td><td>"+data[i].book_surplus+"</td><td><a href=# id=borrow? onclick=borrow("+data[i].id+","+account+")>借书</a></td></tr>");
                    }
                    }  
            }) 
        }      
     })
  })
</script>
</head>

<body class="fix-header card-no-border">
    <!-- ============================================================== -->
    <!-- Preloader - style you can find in spinners.css -->
    <!-- ============================================================== -->
    <div class="preloader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" /> </svg>
    </div>
    <!-- ============================================================== -->
    <!-- Main wrapper - style you can find in pages.scss -->
    <!-- ============================================================== -->
    <div id="main-wrapper">
        <!-- ============================================================== -->
        <!-- Topbar header - style you can find in pages.scss -->
        <!-- ============================================================== -->
        <header class="topbar">
            <nav class="navbar top-navbar navbar-toggleable-sm navbar-light">
                <!-- ============================================================== -->
                <!-- Logo -->
                <!-- ============================================================== -->
                <div class="navbar-header">
                    <a class="navbar-brand" href="table-basic.html">
                        <!-- Logo icon -->
                        <b>
                            <!--You can put here icon as well // <i class="wi wi-sunset"></i> //-->
                            <!-- Dark Logo icon -->
                            <img src="assets/images/logo-icon.png" alt="table-basic.html" class="dark-logo" />
                            
                        </b>
                        <!--End Logo icon -->
                        <!-- Logo text -->
                        <span>
                            <!-- dark Logo text -->
                            <img   class="dark-logo" />图书后台管理系统
                        </span>
                    </a>
                </div>
                <!-- ============================================================== -->
                <!-- End Logo -->
                <!-- ============================================================== -->
                <div class="navbar-collapse">
                    <!-- ============================================================== -->
                    <!-- toggle and nav items -->
                    <!-- ============================================================== -->
                    <ul class="navbar-nav mr-auto mt-md-0 ">
                        <!-- This is  -->
                        <li class="nav-item"> <a class="nav-link nav-toggler hidden-md-up text-muted waves-effect waves-dark" href="javascript:void(0)"><i class="ti-menu"></i></a> </li>
                        <li class="nav-item hidden-sm-down">
                            <form class="app-search p-l-20">
                             
                                <input type="text" id="num" class="form-control" placeholder="按书名关键字查找图书..."> <div class="col-md-6 col-4 align-self-center">
                            </form>

                        </li>
                        <!-- 查找图书 -->
                        <button id="find" value="查找"  class="btn pull-right hidden-sm-down btn-success">查找
                      
                    </ul>
                    <!-- ============================================================== -->
                    <!-- User profile and search -->
                    <!-- ============================================================== -->
                  <h1>广西科技大学图书管理系统</h2>
                    <ul class="navbar-nav my-lg-0">
                        <li class="nav-item dropdown">
                            <!-- 管理员名字 -->
                            <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark" href="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img src="assets/images/users/1.jpg" alt="user" class="profile-pic m-r-5" />韦建韩</a>
                        <a href="#" onclick="quit()">注销</a>
                        </li>
                    </ul>
                </div>
            </nav>
        </header>
        <!-- ============================================================== -->
        <!-- End Topbar header -->
        <!-- ============================================================== -->
        <!-- ============================================================== -->
        <!-- Left Sidebar - style you can find in sidebar.scss  -->
        <!-- ============================================================== -->
        <aside class="left-sidebar">
            <!-- Sidebar scroll-->
            <div class="scroll-sidebar">
                <!-- Sidebar navigation-->
                <nav class="sidebar-nav">
                    <ul id="sidebarnav">
                        <li>
                            <a href="table-basic.html" class="waves-effect"><i class="fa fa-table m-r-10" aria-hidden="true"></i>图书信息</a>
                        </li>
                        <li>
                            <a href="pages-profile.html" class="waves-effect"><i class="fa fa-user m-r-10" aria-hidden="true"></i>个人信息</a>
                        </li>
                       
                        <li>
                            <a href="user-admin.html" class="waves-effect"><i class="fa fa-font m-r-10" aria-hidden="true"></i>用户管理</a>
                        </li>
                        
                       
                       
                    </ul>
                   
                </nav>
                <!-- End Sidebar navigation -->
            </div>
            <!-- End Sidebar scroll-->
        </aside>
        <!-- ============================================================== -->
        <!-- End Left Sidebar - style you can find in sidebar.scss  -->
        <!-- ============================================================== -->
        <!-- ============================================================== -->
        <!-- Page wrapper  -->
        <!-- ============================================================== -->
        <div class="page-wrapper">
            <!-- ============================================================== -->
            <!-- Container fluid  -->
            <!-- ============================================================== -->
            <div class="container-fluid">
                <!-- ============================================================== -->
                <!-- Bread crumb and right sidebar toggle -->
                <!-- ============================================================== -->
                <div class="row page-titles">
                    <div class="col-md-6 col-8 align-self-center">
                        <h3 class="text-themecolor m-b-0 m-t-0">书籍管理</h3>
                        
                    </div>
                   
                </div>
                <!-- ============================================================== -->
                <!-- End Bread crumb and right sidebar toggle -->
                <!-- ============================================================== -->
                <!-- ============================================================== -->
                <!-- Start Page Content -->
                <!-- ============================================================== -->
                <div class="row">
                    <!-- column -->
                    <div class="col-sm-12">
                        <div class="card">
                            <div class="card-block">
                                <h4 class="card-title">图书资料-------》》 <a href="增加图书.html" class="text-themecolor m-b-0 m-t-0">增加图书</a>《《--------哎哎！注意看这啊，点这个增加图书</h4>
                        
                                <div class="table-responsive">
                                    <table class="table">
                                        <thead>
                                            <tr>
                                                <th>书号</th>
                                                <th>书名</th>
                                                <th>作者</th>
                                                <th>类别</th>
                                                <th>价格</th>
                                                <th>出版社</th>
                                                <th>库存量</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody id="table1">  
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div style="margin: auto;">
                               <label ><a href="#" id="last"> < 上一页</a></label>
                              当前页数<label id="nowPage"></label>
                               <label ><a href="#" id = "next">下一页 ></a></label> 
                                <label><button id="jump">跳到</button> <input id="page" type="text" style="width: 30px;"/>页</label>
                              <label>&nbsp;一共23页</label>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- ============================================================== -->
                <!-- End PAge Content -->
                <!-- ============================================================== -->
            </div>
            <!-- ============================================================== -->
            <!-- End Container fluid  -->
            <!-- ============================================================== -->
            <!-- ============================================================== -->
            <!-- footer -->
            <!-- ============================================================== -->
            
            <!-- ============================================================== -->
            <!-- End footer -->
            <!-- ============================================================== -->
        </div>
        <!-- ============================================================== -->
        <!-- End Page wrapper  -->
        <!-- ============================================================== -->
    </div>
    <!-- ============================================================== -->
    <!-- End Wrapper -->
    <!-- ============================================================== -->
    <!-- ============================================================== -->
    <!-- All Jquery -->
    <!-- ============================================================== -->
    <script src="assets/plugins/jquery/jquery.min.js"></script>
    <!-- Bootstrap tether Core JavaScript -->
    <script src="assets/plugins/bootstrap/js/tether.min.js"></script>
    <script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
    <!-- slimscrollbar scrollbar JavaScript -->
    <script src="js/jquery.slimscroll.js"></script>
    <!--Wave Effects -->
    <script src="js/waves.js"></script>
    <!--Menu sidebar -->
    <script src="js/sidebarmenu.js"></script>
    <!--stickey kit -->
    <script src="assets/plugins/sticky-kit-master/dist/sticky-kit.min.js"></script>
    <!--Custom JavaScript -->
    <script src="js/custom.min.js"></script>
    <!-- ============================================================== -->
    <!-- Style switcher -->
    <!-- ============================================================== -->
    <script src="assets/plugins/styleswitcher/jQuery.style.switcher.js"></script>
</body>

</html>
